<template>
  <div>
    <h2 v-if="isShow">loading.......</h2>
    <h2 v-else>most start repo is <a :href="repoUrl">{{repoName}}</a></h2>
  </div>
</template>

<script>
  import Axios from 'axios';

  export default {
    name: "App",
    data() {
      return {
        isShow: true,
        repoName: '',
        repoUrl: ''

      }
    },
    mounted() {
      // 异步请求获取，最热门的仓库
      const searchUrl = 'https://api.github.com/search/repositories?q=v&sort=stars';

      this.$http.get(searchUrl).then(({data}) => {
        // 修改数据
        this.repoUrl = data.items[0].html_url;
        this.repoName = data.items[0].name;
        this.isShow = false
      }).catch(console.error);
      /*
      Axios.get(searchUrl).then(({data}) => {
        // 修改数据
        this.repoUrl = data.items[0].html_url;
        this.repoName = data.items[0].name;
        this.isShow = false
      }).catch(console.error);*/
    }
  }
</script>

<style scoped>

</style>
